<template>
    <div>
        <h3>侦听器</h3>
        <button @click="change">修改</button>
        <div>{{ message }}</div>
    </div>
</template>

<script>
export default {
    data () {
        return {
            message: "Hello"
        }
    },
    methods:{
        change(){
            this.message = "Hello World"
        }
    },
    watch:{
        // 侦听器，名称必须和要监听的对象名称一致
        message(newValue, oldValue){
            console.log(newValue, oldValue)
        }
    }
}
</script>

<style lang="scss" scoped>

</style>